<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>Promise</title>
	</head>
	<body>
		<script type="text/javascript" >
			//精简的封装——封装xhr
			function sendAjax(url){
				return new Promise((resolve)=>{
					//创建xhr
					const xhr = new XMLHttpRequest();
					xhr.onreadystatechange = ()=>{
						if(xhr.readyState === 4){
							if(xhr.status >= 200 && xhr.status < 300){
								resolve(xhr.response)
							}
						}
					}
					xhr.open('GET',url)
					xhr.responseType = 'json'
					xhr.send()
				})
			}

			//多次请求依次发送（回调地狱）
			/* sendAjax('https://api.apiopen.top/getJoke?type=text',(data)=>{
				console.log('第1次请求成功了',data)
				sendAjax('https://api.apiopen.top/getJoke?type=text',(data)=>{
					console.log('第2次请求成功了',data)
						sendAjax('https://api.apiopen.top/getJoke?type=text',(data)=>{
						console.log('第3次请求成功了',data)
					})
				})
			}) */


			(async()=>{
				try {
					const result1 = await sendAjax('https://api.apiopen.top/getJoke?type=text')
					console.log('第1次请求成功了',result1)
					const result2 = await sendAjax('https://api.apiopen.top/get4e56iojJoke?type=text')
					console.log('第2次请求成功了',result2)
					const result3 = await sendAjax('https://api.apiopen.top/getJoke?type=text')
					console.log('第3次请求成功了',result3)
				} catch (error) {
					console.log(error)
				}
			})()
		</script>
	</body>
</html>